@page
@{ Layout = "_LayoutHome"; }
@section Styles{
  <link rel="stylesheet" href="/sitefiles/assets/lib/ueditor/third-party/custom/custom.css">
  <style>
    html, body {
      height: 100%;
      overflow: hidden;
    }
    .el-tag {
      height: auto;
      white-space: inherit;
      margin-bottom: 5px;
      margin-right: 5px;
    }
  </style>
}

<el-alert
  v-if="pageType === 'Unauthorized'"
  title="提示"
  type="warning"
  description="您的投稿权限尚未开通，请联系管理员解决。"
  :closable="false"
  show-icon>
</el-alert>

<template v-if="!pageType">

  <el-container style="padding-top: 0; padding-bottom: 0; overflow:hidden;" :style="{height: mainHeight}">
    <el-main style="padding: 0; margin: 0">
      <el-scrollbar class="scrollbar" :style="{height: mainHeight}">
        
        <el-form style="margin: 10px 20px 20px 10px" ref="form" :model="form" size="small" status-icon label-width="80px">
          @await Html.PartialAsync("_PartialForm")
        </el-form>
  
      </el-scrollbar>
    </el-main>
    <el-aside v-if="isSettings" width="280px">
      <el-scrollbar class="scrollbar" :style="{height: mainHeight}">
        
        <el-collapse v-model="collapseSettings" style="margin-left: 5px;">
          <el-collapse-item title="审核状态" name="checkedLevel">
            <el-select v-model="form.checkedLevel" size="small" style="width: 100%;">
              <el-option
                v-for="level in checkedLevels"
                :key="level.value"
                :label="level.label"
                :value="level.value"></el-option>
            </el-select>
          </el-collapse-item>
          <el-collapse-item title="内容属性" name="attributes">
            <el-checkbox v-model="form.top">置顶</el-checkbox>
            <el-checkbox v-model="form.recommend">推荐</el-checkbox>
            <el-checkbox v-model="form.hot">热点</el-checkbox>
            <el-checkbox v-model="form.color">醒目</el-checkbox>
          </el-collapse-item>
          <el-collapse-item title="内容组" name="groupNames">
            <el-checkbox-group v-model="form.groupNames">
              <el-checkbox v-for="groupName in groupNames" :key="groupName" :label="groupName" :value="groupName" name="groupNames"></el-checkbox>
            </el-checkbox-group>
          </el-collapse-item>
          <el-collapse-item title="标签" name="tagNames">
            <el-select
              v-model="form.tagNames"
              style="width: 100%;"
              size="small"
              multiple
              filterable
              allow-create
              default-first-option
              placeholder="请选择内容标签">
              <el-option
                v-for="tagName in tagNames"
                :key="tagName"
                :label="tagName"
                :value="tagName">
              </el-option>
            </el-select>
            <small class="tips">输入文字后回车可创建新标签</small>
          </el-collapse-item>
          <el-collapse-item title="外部链接" name="linkUrl">
            <el-input v-model="form.linkUrl" name="linkUrl" placeholder="设置后链接将指向此地址" size="small" autosize :autosize="{ minRows: 2, maxRows: 4}" type="textarea" data-vv-as="外部链接" v-validate="'url'"></el-input>
            <small class="tips">设置外部链接后系统将不会生成内容页面</small>
          </el-collapse-item>
          <el-collapse-item title="添加时间" name="addDate">
            <el-date-picker
              v-model="form.addDate"
              size="small"
              type="datetime"
              value-format="yyyy-MM-ddTHH:mm:ss.000Z"
              placeholder="选择内容添加时间">
            </el-date-picker>
          </el-collapse-item>
        </el-collapse>
  
      </el-scrollbar>
    </el-aside>
  </el-container>
  
  <el-divider></el-divider>
  
  <el-row style="text-align: center; padding-top:4px">
    <el-button size="medium" v-on:click="btnSaveClick" type="primary">保 存</el-button>
    <el-button size="medium" v-on:click="btnPreviewClick" type="info">预 览</el-button>
    <el-button size="medium" v-on:click="btnCloseClick" type="default">关 闭</el-button>
    <el-button size="medium" icon="el-icon-setting" circle :type="isSettings ? 'info' : 'default'" v-on:click="isSettings = !isSettings"></el-button>
  </el-row>

</template>

@section Scripts{
  <script src="/sitefiles/assets/lib/ueditor/editor_config.js" type="text/javascript" ></script>
  <script src="/sitefiles/assets/lib/ueditor/ueditor.all.js" type="text/javascript"></script>
  <script src="/sitefiles/assets/lib/ueditor/third-party/custom/custom.js" type="text/javascript"></script>
  <script src="/sitefiles/assets/js/home/write/editor.js" type="text/javascript"></script>
}